<div class="sider-margin sider-box">
    <div class="sider-search">
        <div class="input-group sider-search-input">
            <form class="form-search">
                <input type="text" class="form-control sider-search-input" id="search" placeholder="请输入关键词" name="tag">
                <span class="input-group-btn">
                    <button class="btn btn-default btn-search" type="button"><i class="iconfont icon-search search"></i></button>
                </span>
            </form>
        </div>
    </div>
</div>
<script>
    $('.btn-search').click(function(){
        var tag = $('#search').val();
        if(tag !== ''){
            $.ajax({
                type : 'post',
                data : {'tag':tag},
                datatype : 'json',
                url : "{:url('index/index/search')}",
                success : function(data){
                   $('#arc_box').html(data);
                }

            });
        }else{
            alert('请输入关键词');
        }
    });

    $("#search").keyup(function(){
        var tag = $('#search').val();
        
            $.ajax({
                type : 'post',
                data : {'tag':tag},
                datatype : 'json',
                url : "{:url('index/index/search')}",
                success : function(data){
                   $('#arc_box').html(data);
                }

            });
        
    });

</script>
<div class="sider-margin sider-box">
    <h4><i class="iconfont icon-tags"></i>&nbsp;&nbsp;我的标签</h4>
    <ul class="sider-tag-ul">
        {volist name="tag" id="tag"}
        <li class="label label-danger sider-tag-end "><a href="/tagArctile/{$tag.id}">{$tag.tname}</a></li>
        {/volist}
    </ul>
</div>

<div class="sider-box">
    <h4><i class="iconfont icon-review"></i>&nbsp;&nbsp;最新互动</h4>
    <div class="tab"  id="tab">
        <ul class="nav nav-tabs" >
            <li class="active"><a href="#art" data-toggle="tab">最新文章</a></li>
            <li><a href="#con" data-toggle="tab">最热文章</a></li>
            <li><a href="#hot" data-toggle="tab">点赞最多</a></li>
        </ul>
    </div>
</div>
<div class="sider-box">
    <div class="tab-content">
        <div class="tab-pane fade in active" id="art">
            <ul class="sider-content-ul">
                {volist name="newArc" id="info"}
                <li style="min-height: 30px;line-height: 30px;"><a style="color: #0b6cbc;" href="/content/{$info.id}" >{$info.title}</a>({:Date('Y:m:d H:m:s',$info.release_time)})</li>
                {/volist}
            </ul>
        </div>
        <div class="tab-pane fade" id="con">
            <ul class="sider-content-ul">
                {volist name="hotArc" id="info"}
                <li  style="min-height: 30px;line-height: 30px;"><a style="color: #0b6cbc;" href="/content/{$info.id}" >{$info.title}</a>({$info.browse_num}人次浏览)</li>
                {/volist}
            </ul>
        </div>
        <div class="tab-pane fade" id="hot">
            <ul class="sider-hot-ul">
                {volist name="praiseArc" id="info"}
                <li ><a style="color: #0b6cbc;" href="/content/{$info.id}" >{$info.title}</a>({$info.praise_num}个赞)</li>
                {/volist}
            </ul>
        </div>
    </div>
</div>